<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>小米官网</title>
		<style>
			*{
				margin: 0;
				padding: 0;
			}
.box{
	width: 100%;
	height:80px;
	border: 1px solid black;
	background-color: black;
}
.a{
	width: 1200px;
	height: 80px;
	border: 1px solid pink;
	background-color: pink;
	margin: auto;
}
.a1{
	width: 600px;
	height: 80px;
	border: 1px solid red;
	background-color: red;
	float: left;
}
.a2{
	width: 400px;
	height: 80px;
	border: 1px solid blue;
	background-color: blue;
	float: right;
}
.b{
	width: 1200px;
	height: 80px;
	background-color: yellow;
	margin:10px auto;
	border: 2px solid yellow;
}
.b1{
	width: 100px;
	height: 80px;
	background-color: purple;
	float: left;
}
.b2{
	width: 600px;
	height: 80px;
	background-color: purple;
	margin: auto;
}
.b3{
	width: 200px;
	height: 80px;
	background-color: purple;
	float: right;
	margin-top: -80px;
}
.p{
	width: 1200px;
	height: 500px;
	background-color: brown;
	margin: auto;
}
.p1{
	width: 400px;
	height: 500px;
	background-color: orange;
	float: left;
}
.p2{
	width: 800px;
	height: 500px;
	background-color: deeppink;
	float: right;
}
.t{
	width: 1200px;
	height: 200px;
	background-color: black;
	margin: auto;
}
.t1{
	width: 300px;
	height: 200px;
	background-color: salmon;
	float: left;
}
.t2{
	width: 300px;
	height: 200px;
	background-color: gray;
	float: left;
}
.t3{
	width: 300px;
	height: 200px;
	background-color: orchid;
	float: left;
}
.t4{
	width: 300px;
	height: 200px;
	background-color: firebrick;
	float: left;
}
.L{
	width: 1200px;
	height: 150px;
	background-color: lightgreen;
	margin: auto;
}
		</style>
	</head>
	<body>
		<div class="box">
			<div class="a">
				<div class="a1"></div>
				<div class="a2"></div>
			</div>
		</div>
		<div class="b">
			<div class="b1"></div>
			<div class="b2"></div>
			<div class="b3"></div>
		</div>
		<div class="p">
			<div class="p1"></div>
			<div class="p2"></div>
		</div>
		<div class="t">
			<div class="t1"></div>
			<div class="t2"></div>
			<div class="t3"></div>
			<div class="t4"></div>
		</div>
		<div class="L"></div>
		</body>
		</html>